Zum Hauptinhalt springen

Docusaurus Installation

Step 3: Install Docusaurus​

Next, let's proceed with setting up Docusaurus.

Offical Docusaurus Documentation

For additional information and detailed instructions about Docusaurus, refer to the official Documentation. Please note that we won't cover everything here.

1) Install Docusaurus​

To install Docusaurus, execute the following command:

npx create-docusaurus@latest website classic
note

You can use different names for your vault and Docusaurus installation. However, you would need to modify these in your Obsidian / Obsidiosaurus Plugin settings. I recommend using website for your Docusaurus installation and vault for your Obsidian vault.

2) ### Verify installation​

After executing the installation command, your folder structure should look something like this:

website
├── blog
│   └── ...
├── docs 
│   └── ...
├── src
│   ├── components
│   │   └── ...
│   ├── css
│   │   └── custom.css
│   └── pages
│       ├── styles.module.css
│       └── index.js
├── static
│   └── img
├── docusaurus.config.js
├── package.json
├── README.md
├── sidebars.js
├── babel.config.js
└── package-lock.json

To confirm that Docusaurus has been installed correctly, let's run the Docusaurus development server:

cd my-website
npm run start

By default, this should open a browser window at http://localhost:3000

Closing the Development Server Session

Dont forget to terminate the development server session by pressing CTRL + C in your terminal

4) Delete the blog & docs folder​

Lastly, delete the blog and docs folders which contain pre-built files.

website
├── blog <- DELETE FOLDER
│   └── ...
├── docs <- DELETE FOLDER
│   └── ...
├── src
│   └── ...
├── static
│   └── img
├── docusaurus.config.js
├── package.json
├── README.md
├── sidebars.js
├── babel.config.js
└── package-lock.json

5) Save progess​

Save your progress by creating a git commit, in your terminal run:

git add .
git commit -m "Install Docusaurus"
git push